<script setup lang="ts">
import * as echarts from 'echarts'
import { ref, onMounted, defineProps, shallowRef } from 'vue'
// 接收父组件传递的option
const { option } = defineProps(['option'])
// 定义ref数据获// 取DOM节点
const mycharts = ref()
let charts = shallowRef({})
onMounted(() => {
  // console.log(mycharts.value, 11111)
  charts.value = echarts.init(mycharts.value)
  charts.value.setOption(option)
  // //   监听页面大小改变
  // window.onresize = () => {
  //   charts.resize()
  // }
})
defineExpose({
  charts
})
</script>

<template>
  <div class="mycharts" ref="mycharts"></div>
</template>

<style lang="scss" scoped>
.mycharts {
  width: 100%;
  height: 100%;
}
</style>